.task-add{
    .task-add-up{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        font-weight: var(--tiklab-font-weight-bold);
        height: 40px;
        padding: 0 var(--tiklab-padding);
    }
    .task-add-bottom{
        overflow: hidden;
        height: calc(100% - 46px);
        padding: 0;
        .gui-drawer-content{
            height: 100%;
            .gui-drawer-content-left{
                border-right: 1px solid var(--tiklab-gray-200);
                .drawerLeft{
                    height: 100%;
                    overflow-y: auto;
                    .item{
                        padding: 5px var(--tiklab-padding);
                        cursor: pointer;
                        position: relative;
                        &:before{
                            width: 3px;
                            height: 32px;
                            -webkit-transition: all .4s cubic-bezier(.23,1,.32,1);
                            transition: all .4s cubic-bezier(.23,1,.32,1);
                            content: " ";
                            position: absolute;
                            z-index: 2;
                            left: 0;
                            top: 0;
                        }
                    }
                    .item-select{
                        background: #f4f4f4;
                        &:before{
                            background:var(--tiklab-blue);
                        }
                    }
                }
            }
            .gui-drawer-content-right{
                .drawerRight{
                    padding: 20px;
                    height: 100%;
                    overflow: auto;
                }
                .group{
                    margin-bottom: 15px;
                    &-title{
                        margin-bottom: 12px;
                    }
                    &-content{
                        display: flex;
                        justify-content: space-between;
                        flex-wrap: wrap;
                        width: 440px;
                        &:after{
                            content: "";
                            width: 214px;
                            height: 0;
                            background: transparent;
                            opacity: 0;
                        }
                    }
                    &-desc{
                        border: 1px solid var(--arbess-border-color);
                        border-radius: 4px;
                        width: 214px;
                        height: 80px;
                        display: inline-flex;
                        align-items: center;
                        cursor: pointer;
                        margin-bottom: 15px;
                        padding: 0 15px;
                        transition: transform .218s ease-in,-webkit-transform .218s ease-in;
                        &:hover{
                            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
                        }
                        .group-desc-icon{
                            align-items: center;
                            border-radius: 4px;
                            display: inline-flex;
                            height: 44px;
                            justify-content: center;
                            width: 44px;
                        }
                        .group-desc-right{
                            margin-left: 10px;
                            .group-desc-info{
                                font-size: 13px;
                                color: #999999;
                            }
                        }
                    }
                    .group-desc-ban{
                        background-color: #f8f8f8;
                    }
                    &-type{
                        margin: 10px;
                    }
                }
            }
        }
    }
}

